Belajar menampilkasn semua data kita 

Dihalaman pertma menampilkan semua data yg ada didatabase 
Buat models sesuai dgn database sesuai dgn table 

Buat folder model todo model.dart 

Class TodoModel didalam kita buat sesuai dgn table kita 

Ada id ttitle dan desc 
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Kita buat id integer 

String titile dan string decs 

Buat constructor nya 
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TodoModel({ 
required this.id, 
required this.title, 
required this.description, 


}); 


956 now( amel), Tromimestrue 


7950): app time stats: avg-144.34ms mi 


app time stats: avg 
D p 
OUTLINE n 
e_stats 11.55ms max=110059.94ms co n 
rulator) © Prettier 
TIMELINE t=12 2 RIGI 


DEPENDENCIES 


SR YouTube CI 
Angel A 
02:14 12:46 


NI ep a Fs 0 | 
Kita sudah membuat model nya sekarang Kembali ke todos provider buat future 
Kemudian nama getTodo tapi future nya void 

Kita akan menampilkan semua todo kita 

Buat List kosong kita buat string kosng dahulu 

Ini untuk data list kita 
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List«TodoModel» itemTodo = []; 


isLoading 
notifyLis 
manager.dart y 
del.dart Futurecvoid» getTodo() {} 
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Untuk get todo kasi async 

Kita copy database kita maka sudah punya 

Sekarang kita tampilkan database seerti kemarin 


Dia database masuk kedalam sebuh variabel list yg tipenya map didalamnya string 
kery string value nya dynamic beri nama data lalu db.query dari table todos buat 
await 
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Jadi data yg kita tambhakn masuk kedalam db,query 

Dan data akan ditambahkan kedalam kita buat 

Ini yg dibuat kita cut bukan didalam tapi diluar 
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Kemudian kita merubah nya caranya 

Pertama gunakan 

For item in data 

Kita tambahkan kedalam itemTodo kita add didalam nya ada TodoModel id dari 
item[id] dan seterusnya 
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sudah menambahkan data kita sekarang bagaimana menampilkan data ini 
Todo models 
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Kita memakai future builder 

Futere builder pertama membutuhkan future: kita ambil dari todos provider kita 
amabil todos.getdodo() 

getTodo ini jenis future maka kita apakai getTodo 

builder nya bentukanya context sama snapshoot 

kita akan menreturn list view 

dan item count pakai todos.itemTodo.lengt 

item builder nya butuhkan context, index 

return 
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Buat file baru todo dia dipecah jadi masing todo adalah data todo 
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Lalu return ttile nya 
Maka disni sudah ada maka semua data akan tampil 
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Convert dahulu menjadi statefull 
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@override 
State«Tod 


class TodoSc e extends StatexTod 
@override 
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Tingal ubah saja menjadi stateful 


Disni ada kesalahan kita di save maka terus menambah atau menrefresh kemali 


Tidak ingin kemabli karena kita menambahkan 
Data yg ada didalam database maka ditambhkan lagi 
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Jika direfresh mana data menambahakn lagi 
Jadi kalau itu maka kita clear dahulu datanya 
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Futurecvoid» getTodo() async 4 
Database db it database.db: 
F ynamic»» data = await db.guery 
(e ); 
itemTodo.clear(); 
for (var item in data) { 
itemTodo.add( 
1( 
id: item[ b 
title: item['title'], 
description: item[ 


e_manager.dart 


( 7950 
7950 
f 876 libr 
(| 7950 
TIMELINE 


mimo) @Prewer 2 Q 


DEPENDENCIES 


BG Youlube £3 
a 2 Bi 


x 


10:14 
II pema) E SSM 


Jadi dia membersihkan dahulu kemudian diganti dgn yg mau ditambah 
Jika dissave maka tidak akan bertambah 
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Li r amic>> data = await db.query 
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itemTodo.clear(); 

for (var item in data) { 
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Sekrang kita tambah misalkan tambah data 8 

Kita add belum tampil karena belum referesh 

Jadi caranya 

Ke navigator kita pakai push 

Push itu ada method then dia akan mereturn setState 
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context, 
MaterialPageRoute( 
builder: (context) => C 
create: (context) => 
child: AddTodo(), 
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Ketika di klik maka dia push jika dia Kembali akan menrefresh ulang 

Buat Kembali lagi data 9 

Maka dia ada data 9 itu guna nya setState 

Jadi navigator push kita pop lagi mengunakan then setState 

Maka bisa berikutnya mempelajari delete dari db 

Bisa menmpilkan data dan menambhakna data 


Models/ catat model.dart 
CatatModel 4 
int id; 
String judul; 
String keterangan; 


CatatModel({ 
Jid, 
„judul, 
„keterangan, 


Main.dart 


0 4 
| MyApp()); 


MyApp : StatelessWidget 4 
MyApp(4Key? key?) : (key: key): 


@override 
Widget build(BuildContext context) 4 
MaterialApp/( 
home: ChangeNotifierProvider( 
create: (context) => Catat), 
child: LayarCatatan(), 


Layar catatan.dart 


, 


LayarCatatan StatefulWidget £ 
LayarCatatan(4Key? key}) : (key: key): 


@override 
StatexLayarCatatan- cr 2State() => LayarCatatanStatel/): 
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 LayarCatatanState StatexLayarCatatan- 4 
@override 
Widget Id(BuildContext context) 4 
Catat catat = Provider.ofxCatat-(context): 


Scaffold( 
floatingActionButton: FloatingActionButton( 
onPressed: () 4 
Navigator. h( 
context, 
MaterialPageRoute( 
builder: (context) => ChangeNotifierProvider( 
create: (context) => Catat), 
child: TambahCatatan/), 


((value) => tate(() {})); 
b 
child: Icon(Icons.add task), 
), 
appBar: AppBar( 
title: Text( ), 
Ds 
body: FutureBuilder( 
future: catat.c tat(), 
builder: (context, snapshoot) { 
ListView.builder( 
itemCount: catat.itemCatat.length, 
itemBuilder: (context, index) £ 
Catatan = catat.itemCatat|indexJ, 
| ListTile( 
title: Text(catatan.judul), 
ya 


Tambah catatan.dart 


, 


TambahCatatan StatelessWidget 4 
TambahCatatan(4Key? key?) : (key: key); 


@override 
Widget k (BuildContext context) 4 
Catat catat — Provider.ofxCatat-(context): 


Scaffold( 
appBar: AppBar( 
title: Text( 
Ji 
body: Padding( 
padding: const Edgelnsets.all(20.0), 
child: Column( 
crossAxisAlignment: CrossAxisAlignment.start, 
children: | 
TextField( 
controller: catat.judulControler, 
decoration: InputDecoration( 
border: OutlineInputBorder(), 
Ji 
), 
SizedBox( 
height: 10, 
J 
TextField ( 
controller: catat.keteranganControler, 
decoration: InputDecoration( 
border: OutlinelnputBorder(), 
), 
Ji 
ElevatedButton( 
onPressed: () { 
(catat.judulControler.text.isNotEmpty && 
catat.keteranganControler.text.isNotEmpty) £ 
Catat.tamba at): 


( ): 
) 


ha 
child: Text(catat.isLoading ? 


Provider / catat.dart 


Catat with ChangeNotifier 4 
TextEditingController judulControler = TextEditingController(): 


TextEditingController keteranganControler = TextEditingController(); 


DatabaseManager database = DatabaseManager.instace; 


bool isLoading — false; 
ListxCatatModel- itemCatat = II: 


void tambahCatat() async 4 
Database db = await database.db: 
await db.insert('catat', { 
'judul': judulControler.text, 
'keterangan': keteranganControler.text, 
WIE 


isLoading = false; 
notifyListeners(); 
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Futurex void» getCatat() async 4 
Database db = await database.db: 
ListxMapxString, dynamic>> data = await db.guery('catat'): 


itemCatat.clear(): 
for (var item in data) 4 
itemCatat.add( 
CatatModel( 
id: item['id'], 
judul: itemf'judul'l, 
keterangan: item|'keterangan'!, 


